
<!--商品更新详情-->
<template>
  <div class="detaillBox">
    <div class="detaillTable">
      <div class="detaillTopBox">
        <span><i></i>基本信息</span>
      </div>
      <table border="1">
        <tr>
          <th>商品名称：</th>
          <td colspan="3">清华同方（QTINGHUATONGF）精锐 M810(八代i5-8400 8G 128GSSD+1T 内置wifi 正版office )</td>
        </tr>
        <tr>
          <th>商品ID：</th>
          <td>{{tableDataMis.id}}</td>
          <th>商品状态：</th>
          <td>已通过</td>
        </tr>
        <tr>
          <th><i>*</i>商品分类：</th>
          <td>北京和硕立业科技有限公司</td>
          <th><i>*</i>更新状态：</th>
          <td>和硕立业</td>
        </tr>
        <tr>
          <th><i>*</i>品牌：</th>
          <td>厂商</td>
          <th><i>*</i>销售单位：</th>
          <td>李某某</td>
        </tr>
        <tr>
          <th><i>*</i>型号：</th>
          <td>88975787879</td>
          <th><i>*</i>重量（含包装：</th>
          <td>河南省 - 南阳市 - 南召县</td>
        </tr>
        <tr>
          <th><i>*</i>采购价（含税）：</th>
          <td>
            黄杨路与东大街交叉口1102街交叉口
          </td>
          <th><i>*</i> 产地：</th>
          <td>10000㎡</td>
        </tr>
        <tr>
          <th><i>*</i>友商售价：</th>
          <td>
            黄杨路与东大街交叉口1102街交叉口
          </td>
          <th><i>*</i> 保质期：</th>
          <td>10000㎡</td>
        </tr>
        <tr>
          <th><i>*</i>友商链接：</th>
          <td>
            黄杨路与东大街交叉口1102街交叉口1102
          </td>
          <th><i>*</i> 质保：</th>
          <td>10000㎡</td>
        </tr>
        <tr>
          <th><i>*</i>友商链接：</th>
          <td>
            黄杨路与东大街交叉口1102街交叉口1102街交叉口
          </td>
          <th><i>*</i> 执行标准：</th>
          <td>10000㎡</td>
        </tr>
        <tr>
          <th><i>*</i>友商链接：</th>
          <td>
            黄杨路与东大街交叉口1102街交叉口
          </td>
          <th><i>*</i> 条形码：</th>
          <td>10000㎡</td>
        </tr>
        <tr>
          <th><i>*</i>销售价（含税）：</th>
          <td>
            黄杨路与东大街交叉口1102街交叉口1102
          </td>
          <th><i>*</i> 广告语：</th>
          <td>10000㎡</td>
        </tr>
        <tr>
          <th><i>*</i>官网售价（含税：</th>
          <td>
            黄杨路与东大街交叉口1102街交叉口1102
          </td>
          <th><i>*</i> 包装清单：</th>
          <td>10000㎡</td>
        </tr>
        <tr>
          <th><i>*</i>集团主管/经理账号：</th>
          <td>
            黄杨路与东大街交叉口1102街交叉口1102街
          </td>
          <th><i>*</i> 集团专员账号：</th>
          <td>10000㎡</td>
        </tr>
        <tr>
          <th><i>*</i>集团主管/经理姓名：</th>
          <td>
            黄杨路与东大街交叉口1102街交叉口
          </td>
          <th><i>*</i> 集团专员姓名：</th>
          <td>10000㎡</td>
        </tr>
        <tr>
          <th><i>*</i>开票名称：</th>
          <td>
            黄杨路与东大街交叉口1102街交叉口
          </td>
          <th><i>*</i> 开票规格型号：</th>
          <td>10000㎡</td>
        </tr>
        <tr>
          <th><i>*</i>税收分类名称：</th>
          <td>
            黄杨路与东大街交叉口1102街交叉口
          </td>
          <th><i>*</i> 税率：</th>
          <td>10000㎡</td>
        </tr>
        <tr>
          <th><i>*</i>税收分类编码：</th>
          <td>
            黄杨路与东大街交叉口1102街交叉口
          </td>
          <th><i>*</i> 集团专员姓名：</th>
          <td></td>
        </tr>
        <tr>
          <th><i>*</i>非销售区域：</th>
          <td colspan="3">
            黄杨路与东大街交叉口1102街交叉口
          </td>

        </tr>
      </table>
    </div>
    <div class="detaillTable">
      <div class="detaillTopBox">
        <span><i></i>参数信息</span>
      </div>
      <table border="1">
        <tr>
          <th style="text-align: center">属性组一</th>
          <td colspan="3"></td>
        </tr>
        <tr>
          <th>规格：</th>
          <td>{{tableDataMis.id}}</td>
          <th>级别：</th>
          <td>待审核</td>
        </tr>
        <tr>
          <th><i>*</i>操作系统：</th>
          <td>北京和硕立业科技有限公司</td>
          <th><i>*</i>CPU类型：</th>
          <td>和硕立业</td>
        </tr>
        <tr>
          <th><i>*</i>CPU型号：</th>
          <td>厂商</td>
          <th><i>*</i>CPU速度：</th>
          <td>李某某</td>
        </tr>
        <tr>
          <th><i>*</i>三级缓存：</th>
          <td>88975787879</td>
          <th><i>*</i> 核心：</th>
          <td>河南省 - 南阳市 - 南召县</td>
        </tr>
        <tr>
          <th><i>*</i>内存容量：</th>
          <td>
            黄杨路与东大街交叉口1102街交叉口1102街交叉口1102黄杨路与东大街交叉口1102街交叉口1102街交叉口1102
          </td>
          <th><i>*</i>插槽数量：</th>
          <td>10000㎡</td>
        </tr>
        <tr>
          <th><i>*</i>硬盘容量：</th>
          <td>
            黄杨路与东大街交叉口1102街交叉口1102街交叉口1102黄杨路与东大街交叉口1102街交叉口1102街交叉口1102
          </td>
          <th><i>*</i>固态硬盘（自定义：</th>
          <td>10000㎡</td>
        </tr>
      </table>
      <table border="1">
        <tr>
          <th style="text-align: center">属性组二</th>
          <td colspan="3"></td>
        </tr>
        <tr>
          <th>规格：</th>
          <td>{{tableDataMis.id}}</td>
          <th>级别：</th>
          <td>待审核</td>
        </tr>
        <tr>
          <th><i>*</i>操作系统：</th>
          <td>北京和硕立业科技有限公司</td>
          <th><i>*</i>CPU类型：</th>
          <td>和硕立业</td>
        </tr>
        <tr>
          <th><i>*</i>CPU型号：</th>
          <td>厂商</td>
          <th><i>*</i>CPU速度：</th>
          <td>李某某</td>
        </tr>
        <tr>
          <th><i>*</i>三级缓存：</th>
          <td>88975787879</td>
          <th><i>*</i> 核心：</th>
          <td>河南省 - 南阳市 - 南召县</td>
        </tr>
        <tr>
          <th><i>*</i>内存容量：</th>
          <td>
            黄杨路与东大街交叉口1102街交叉口1102街交叉口1102黄杨路与东大街交叉口1102街交叉口1102街交叉口1102
          </td>
          <th><i>*</i>插槽数量：</th>
          <td>10000㎡</td>
        </tr>
        <tr>
          <th><i>*</i>硬盘容量：</th>
          <td>
            黄杨路与东大街交叉口1102街交叉口1102街交叉口1102黄杨路与东大街交叉口1102街交叉口1102街交叉口1102
          </td>
          <th><i>*</i>固态硬盘（自定义）：</th>
          <td>10000㎡</td>
        </tr>
      </table>
      <table border="1">
        <tr>
          <th style="text-align: center">属性组三</th>
          <td colspan="3"></td>
        </tr>
        <tr>
          <th>规格：</th>
          <td>{{tableDataMis.id}}</td>
          <th>级别：</th>
          <td>待审核</td>
        </tr>
        <tr>
          <th><i>*</i>操作系统：</th>
          <td>北京和硕立业科技有限公司</td>
          <th><i>*</i>CPU类型：</th>
          <td>和硕立业</td>
        </tr>
        <tr>
          <th><i>*</i>CPU型号：</th>
          <td>厂商</td>
          <th><i>*</i>CPU速度：</th>
          <td>李某某</td>
        </tr>
        <tr>
          <th><i>*</i>三级缓存：</th>
          <td>88975787879</td>
          <th><i>*</i> 核心：</th>
          <td>河南省 - 南阳市 - 南召县</td>
        </tr>
        <tr>
          <th><i>*</i>内存容量：</th>
          <td>
            黄杨路与东大街交叉口1102街交叉口1102街交叉口1102黄杨路与东大街交叉口1102街交叉口1102街交叉口1102
          </td>
          <th><i>*</i>插槽数量：</th>
          <td>10000㎡</td>
        </tr>
        <tr>
          <th><i>*</i>硬盘容量：</th>
          <td>
            黄杨路与东大街交叉口1102街交叉口1102街交叉口1102黄杨路与东大街交叉口1102街交叉口1102街交叉口1102
          </td>
          <th><i>*</i>固态硬盘（自定义：</th>
          <td>10000㎡</td>
        </tr>
      </table>
    </div>
    <div class="bannerBox">
      <div class="headerBannerBox">
        <span><i></i>商品介绍</span>
      </div>
      <div class="mainBannerBox">
        <span><i>*</i>商品轮播图：</span>
        <ul class="banner clear">
          <li><img src="https://gss3.bdstatic.com/7Po3dSag_xI4khGkpoWK1HF6hhy/baike/s%3D500/sign=e52171c617178a82ca3c7fa0c603737f/622762d0f703918fc7ebb6c0583d269759eec486.jpg" alt=""></li>
          <li><img src="https://gss3.bdstatic.com/7Po3dSag_xI4khGkpoWK1HF6hhy/baike/s%3D500/sign=e52171c617178a82ca3c7fa0c603737f/622762d0f703918fc7ebb6c0583d269759eec486.jpg" alt=""></li>
          <li><img src="https://gss3.bdstatic.com/7Po3dSag_xI4khGkpoWK1HF6hhy/baike/s%3D500/sign=e52171c617178a82ca3c7fa0c603737f/622762d0f703918fc7ebb6c0583d269759eec486.jpg" alt=""></li>
          <li><img src="https://gss3.bdstatic.com/7Po3dSag_xI4khGkpoWK1HF6hhy/baike/s%3D500/sign=e52171c617178a82ca3c7fa0c603737f/622762d0f703918fc7ebb6c0583d269759eec486.jpg" alt=""></li>
          <li><img src="https://gss3.bdstatic.com/7Po3dSag_xI4khGkpoWK1HF6hhy/baike/s%3D500/sign=e52171c617178a82ca3c7fa0c603737f/622762d0f703918fc7ebb6c0583d269759eec486.jpg" alt=""></li>

        </ul>
      </div>
      <div class="detailBannerBox"><span><i>*</i>商品详情：</span>
        <ul class="banner clear">
          <li><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1542269831438&di=fb7d629690cf4b357706cfc42142bd83&imgtype=0&src=http%3A%2F%2F03imgmini.eastday.com%2Fmobile%2F20181019%2F20181019031822_623c60707bb3970b222eb38ab49567a7_1.jpeg" alt=""></li>
          <li><img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1542269831438&di=fb7d629690cf4b357706cfc42142bd83&imgtype=0&src=http%3A%2F%2F03imgmini.eastday.com%2Fmobile%2F20181019%2F20181019031822_623c60707bb3970b222eb38ab49567a7_1.jpeg" alt=""></li>
        </ul></div>
    </div>
    <div class="detaillTable2 clear">
      <div class="detaillTopBox">
        <span><i></i>操作详情</span>
      </div>
      <el-table
        :data="tableData"
        border
        style="width: 90%"
        size="small">
        <el-table-column
          prop="date"
          label="操作者"
          style="width: 33%"
          align="center">
        </el-table-column>
        <el-table-column
          prop="name"
          label="操作时间"
          style="width: 33%"
          align="center">
        </el-table-column>
        <el-table-column
          prop="address"
          label="操作描述"
          style="width: 33%"
          align="center">
        </el-table-column>
      </el-table>
      <div class="goTopBox">
        <el-button type="primary" v-backTop>返回顶部</el-button>
        <el-button type="primary">关闭</el-button>
      </div>
    </div>

  </div>

</template>
<script>
  export default {
    data(){
      return {
        tableDataMis: {
          id: '1000001',
          name: '清华同方',
          address: '同方股份有限公司',
          brandstatus:'草稿 审核情况 '
        },
        tableData: [{
          date: '领先未来北京总部>供应链>胡卫卫',
          name: '2017-07-19 14:48:38 ',
          address: '审核通过',
        }, {
          date: '领先未来北京总部>供应链>胡卫卫',
          name: '2017-07-19 14:48:38 ',
          address: '审核通过',
        },
          {
            date: '领先未来北京总部>供应链>胡卫卫',
            name: '2017-07-19 14:48:38 ',
            address: '审核通过',
          },
          {
            date: '领先未来北京总部>供应链>胡卫卫',
            name: '2017-07-19 14:48:38 ',
            address: '审核通过',
          }
          ,
          {
            date: '领先未来北京总部>供应链>胡卫卫',
            name: '2017-07-19 14:48:38 ',
            address: '审核通过',
          }
          ,
          {
            date: '领先未来北京总部>供应链>胡卫卫',
            name: '2017-07-19 14:48:38 ',
            address: '审核通过',
          }],
      }
    },
    methods: {

    }
  }
</script>
<style scoped lang="less">
  @tableBorderColor:#e4e4e4;
  .detaillBox{
    width: 100%;
    padding-top: 10px;
    .detaillTable{
      border: 1px solid #d1d1d1;
      .detaillTopBox{
        height:50px;
        background: #f3f3f3;
        border-bottom: 1px solid #d1d1d1;
        span{
          line-height:50px;
          margin-left:10px;
          i{

          }
        }
      }
      table{
        width:90%;
        margin:20px auto;
        td,th{
          border: 1px solid #d1d1d1;
          font-size:14px;
          height:53px;
          overflow: hidden;
          text-overflow: ellipsis;
        }
        th{
          color:#303133;
          text-align: right;
          width:20%;
          i{
            color:red;
          }
        }
        td{
          color: #666666;
          text-align: left;
          padding-left:10px;
          width:30%;
        }
      }
    }
    .bannerBox{
      border: 1px solid #d1d1d1;
      .headerBannerBox{
        height:50px;
        background: #f3f3f3;
        border-bottom: 1px solid #d1d1d1;
        span{
          line-height:50px;
          margin-left:10px;
          i{
          }
        }
      }
      .mainBannerBox{
        margin-top: 20px;
        span{
          margin-left: 80px;
          i{
            color: red;
          }
        }
        ul{
          li{
            float: left;
            margin-left: 20px;
            img{
              display: block;
              width: 100px;
              height: 100px;
            }
          }
          li:nth-child(1){
            margin-left: 200px;
          }
        }
      }
      .detailBannerBox{
        margin-bottom: 20px;
        span{
          margin-left: 80px;
          i{
            color: red;
          }
        }
        ul{
          li{
            float: left;
            margin-left: 20px;
            img{
              display: block;
              width: 100px;
              height: 100px;
            }
          }
          li:nth-child(1){
            margin-left: 200px;
          }
        }
      }

    }
    .detaillTable2{
      border: 1px solid #d1d1d1;
      border-top:none;
      .detaillTopBox{
        height:50px;
        background: #f3f3f3;
        border-bottom: 1px solid #d1d1d1;
        span{
          line-height:50px;
          margin-left:10px;
          i{

          }
        }
      }
      .el-table {
        margin:20px auto;
        width:90%;
        .el-button {
          font-size: 12px;
        }
      }
      .goTopBox{
        margin-right: 56px;
        .el-button {
          float: right;
          margin:10px 20px;
        }
      }
    }
  }


</style>




